import React from 'react';
import { useTranslation } from 'react-i18next';

interface TranslateProps {
    i18nKey: string; // 翻译的 key
    values?: Record<string, string | number>; // 占位符参数
    defaultText?: string; // 当 key 未找到时的默认文本
    render?: (translatedText: string) => React.ReactNode; // 自定义渲染方法
}

const Translate: React.FC<TranslateProps> = ({ i18nKey, values, defaultText, render }) => {
    const { t } = useTranslation();
    const translatedText = t(i18nKey, { ...values, defaultValue: defaultText || '' });

    if (render) {
        // 如果传入了 render 函数，调用 render 函数
        return <>{render(translatedText)}</>;
    }

    return <>{translatedText}</>;
};

export default Translate;
